<template>
    <div>
        <h1>登录</h1>
    </div>
    <p>默认账号是 abc, 密码是 123</p>
    <div>
        账号名: <input type="text" placeholder="请输入你的账号" v-model="account">
        账号名: <input type="password" placeholder="请输入你的密码" v-model="password">
        <button @click="login">登录</button>
    </div>
    <div>
        <p v-if="isLoginSucc">恭喜你，登录成功</p>
        <p v-else>登录失败，请重新登录</p>
    </div>
</template>

<script>
    export default {
        name:"Login",
        data() {
            return {
                account: "",
                password: "",
                isLoginSucc: false
            }
        },
        methods: {
            login() {
                if (this.account === "abc" && this.password === "123") {
                    this.isLoginSucc = true
                    this.account = ""
                    this.password = ""
                } else {
                    this.isLoginSucc = false
                }
            }
        },
    }
</script>

<style lang="scss" scoped>

</style>